<template>
    <view>
		
		
		
        <!--pages/search/search.ttml-->
        <view class="container">
			<view class="jiangqie-searchbox">
				<view class="jiangqie-search-input">
					<icon type="search" size="13" color="#999"></icon>
					<input
						confirm-type="search"
						placeholder="请输入达人口令搜索壁纸"
						placeholder-class="jiangqie-input-plholder"
						class="jiangqie-input"
						@confirm="handerSearchConfirm"
						@input="handlerSearchInput"
						:value="keyword"
					/>
					<text class="cuIcon-pullright text-blue" style="font-size: 20px;" @click="handerSearch"></text>
				</view>
			</view>
        </view>
		<!--pages/search/search.ttml-->
		<view class="noData" v-if="notData">
			<image src="../../static/images/new/nanguo.png" style="width: 32px;height: 32px;"></image>
			<text>未找到创作者</text>
		</view>

		<!-- 达人列表-->
        <view class="container">
            <view class="list-box data-v-0034d6f4">
                <view class="guoshao-data" v-if="info != null">
                    <view>
                        <image :src="info.avatarUrl" mode="aspectFill" class="image data-v-0034d6f4" :data-userid="info.userid" @click.stop.prevent="talentClick"></image>
                    </view>

                    <view class="guoshao-float">
                        <image class="guoshao-image" :src="info.avatarUrl"></image>
                    </view>
                    <view class="guoshao-view">{{ info.word }}</view>
                </view>
            </view>

            <!--为你推荐-->
            <view class="jiangqie-news-view" v-if="notData">
                <view class="jiangqie-news-type">
                    <text>为你推荐</text>
                </view>
            </view>
            <view class="list-box data-v-0034d6f4" v-if="notData">
                <block v-for="(item,index) in postsLast" :key="index">
                    <view class="guoshao-data">
                        <view>
                            <image
                                :src="item.avatarUrl"
                                mode="aspectFill"
                                class="image data-v-0034d6f4"
                                :index="index"
                                :data-userid="item.userid"
                                @click.stop.prevent="talentClick"
                            ></image>
                        </view>

                        <view class="guoshao-float">
                            <image class="guoshao-image" :src="item.avatarUrl" mode="aspectFill"></image>
                        </view>
                        <view class="guoshao-view">{{ item.word }}</view>
                    </view>
                </block>
            </view>
			<!--加载loadding-->
			<tui-loadmore :visible="loaddingLast"></tui-loadmore>
			<tui-nomore bgcolor="#f7f7f7" style="color:#929292" :visible="!pullUpOnLast"></tui-nomore>
			<!--加载loadding-->
			<!--加载框 start-->
			<tui-loading :visible="loading"></tui-loading>
			<!--加载框 end-->
        </view>
    </view>
</template>

<script>
import tuiLoading from '../../components/loading/loading';
import tuiLoadmore from '../../components/loadmore/loadmore';
import tuiNomore from '../../components/nomore/nomore';
/*
 * Author: 郭少
 * github: https://github.com/guoshao99/wallpaper-applet
 * gitee: https://gitee.com/guoshao99/wallpaper-applet
 * QQ：2549789059
 * 微信：2549789059
 */
const Constant = require('../../utils/constants');

const Util = require('../../utils/util');

const Api = require('../../utils/api.js');

const Rest = require('../../utils/rest');

const util = require('../../utils/util.js');

const http = require('../../utils/http.js');

let setinad;
export default {
    components: {
        tuiLoading,
        tuiLoadmore,
        tuiNomore
    },
    data() {
        return {
            canSearch: false,
            historySearch: [],
            hotSearch: [],
            placeholder: {},
            pagead: 2,
            thisPage: 'search',
            loaddingLast: false,
            postsLast: [],
            pullUpOnLast: true,
            info: null,
            notData: false,
            loadding: false,

            setAD: {
               
            },

            loading: false,
			 keyword: '',
        };
    },
    onLoad: function (options) {
        let that = this;
        that.keyword = options.keyword;
        this.search();
        
        that.setData({
            placeholder: '请输入达人口令搜索壁纸'
        });
    },
    onShow() {
        var that = this;
   //      util.getAD(that, function () {
			// that.setInterstitialAd(); //加载插屏广告
		 //  });
    },
    onHide() {
        clearInterval(setinad);
    },
    onShareAppMessage: function () {
        var that = this;
        uni.showShareMenu({
            withShareTicket: true,
            menus: ['shareAppMessage', 'shareTimeline']
        });
        return {
            title: that.shares.share_title,
            imageUrl: that.shares.share_image,
			path: '/pages/index/index',
        };
    },
    //转发朋友圈
    onShareTimeline: function () {
        var that = this;
        return {
            title: that.shares.share_title,
            imageUrl: that.shares.share_image
        };
    },

    onReachBottom: function () {
        console.log(this.pullUpOnLast);

        if (!this.pullUpOnLast) {
            return;
        }

        this.loadTalents(false);
    },
    methods: {
       
		handerSearch:function(e){
			if(this.keyword == ''){
				uni.showToast({
					title:'请输入创作者口令',
					icon:'none',
				})
				return;
			}
			this.search();
		},
        // 获取小程序插屏广告
        setInterstitialAd: function () {
            var that = this;

            if (that.setAD.interstitialid && uni.createInterstitialAd) {
                let interstitialAd = uni.createInterstitialAd({
                    adUnitId: that.setAD.interstitialid
                }); // 监听插屏错误事件

                interstitialAd.onError((err) => {
                    console.error(err);
                }); // 显示广告

                if (interstitialAd) {
                    if (that.setAD.switch_inad == 'yes') {
                        setinad = setInterval(() => {
                            interstitialAd.show().catch((err) => {
                                console.error(err);
                            });
                        }, 2000);
                    } else {
                        setTimeout(() => {
                            interstitialAd.show().catch((err) => {
                                console.error(err);
                            });
                        }, 6000);
                    }
                }
            }
        },

        //输入
        handlerSearchInput: function (e) {
            this.keyword = e.detail.value;
            this.setData({
                canSearch: this.keyword.length > 0
            });
        },

        handerSearchConfirm: function (e) {
			if(this.keyword == ''){
				uni.showToast({
					title:'请输入创作者口令',
					icon:'none',
				})
				return;
			}
            this.search();
        },

        //搜索
        handerSearchClick: function (e) {
            this.search();
        },

        search: function () {
            //加载达人信息
            this.getTalentInfo();
        },

        getTalentInfo: function () {
            let that = this;
            that.setData({
                info: null
            });
            uni.showLoading({
                title: '加载中' // 内容
            });
            var params = {
                url: '/talent/getTalentByWord',
                method: 'GET',
                data: {
                    word: that.keyword
                },
                callBack: function (res) {
					uni.hideLoading();
                    if (res.code == 200) {
                        that.setData({
                            info: res.data,
                            notData: false
                        });
                    } else {
                        that.setData({
                            notData: true
                        });
                        that.loadTalents(true);
                    }
                    
                }
            };
            http.request(params);
        },

        //取消搜索
        handerCancelClick: function (e) {
            Util.navigateBack();
        },

        loadTalents: function (loadRefresh) {
            let that = this;
            that.setData({
                loadding: true
            });
            let offset = 0;

            if (!loadRefresh) {
                offset = that.postsLast.length;
            }

            var params = {
                url: '/talent/list',
                method: 'GET',
                data: {
                    offset: offset
                },
                callBack: function (res) {
                    if (res.code == 200) {
                        that.setData({
                            loadding: false,
                            postsLast: loadRefresh ? res.data.list : that.postsLast.concat(res.data.list),
                            pullUpOnLast: !res.data.isLastPage ? true : false
                        });
                    } else {
                        uni.showToast({
                            title: res.msg,
                            icon: 'fail',
                            duration: 2000
                        });
                    }
					uni.hideLoading();
                }
            };
            http.request(params);
        },

        talentClick: function (e) {
            let userid = e.currentTarget.dataset.userid;
            userid = userid.replace(/\s+/g, ''); //全局替换空格

            if (userid == 0) {
                uni.navigateTo({
                    url: '/pages/talent/talent?userid=' + userid
                });
            } else {
                uni.navigateTo({
                    url: '/pages/talent/mytalent/mytalent?userid=' + userid
                });
            }
        }
    }
};
</script>
<style>
@import './search.css';
</style>
